@import "../../Master/index";
.comreadbuy{
  text-align: left;
  padding: 1.5rem;
  box-sizing: border-box;
  .Masterfun();
  .listbuy{
    li{
      position: relative;
      height: 15rem;
      -webkit-border-radius: .8rem;
      border-radius: .8rem;
      margin-bottom: 1.5rem;
      .bgimg{
        width: 100%;
        height: 100%;
        -webkit-border-radius: .8rem;
        border-radius: .8rem;
        img{
          width: 100%;
          height: 100%;
          -webkit-border-radius: .8rem;
          border-radius: .8rem;
        }
      }
      .listbuycontent{
        width: 88%;
        height: 15rem;
        position: absolute;
        top: 0;
        left: 6%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: #fff;
        .dutitle{
          font-size: @fontSize15;
          color: #fff;
          opacity: 0.8;
        }
        .duday{
          font-size: 3rem;
          font-weight: 600;
          margin: 1.4rem 0;
        }
        .dumoney{
          display: flex;
          align-items: center;
          .dumoneynow{
            font-size: @fontSize18;
            margin-right: .5rem;
          }
          .dumoneyyuan{
            font-size: @fontSize12;
            text-decoration: line-through;
          }
        }

        .lbcright{
          width: 11rem;
          height: 3.5rem;
          line-height: 3.5rem;
          -webkit-border-radius: 50px;
          border-radius: 50px;
          border: .15rem solid rgba(255,255,255,0.7);
          font-size: @fontSize15;
          text-align: center;
        }
      }
    }
    li:last-child{
      margin-bottom: 0;
    }
  }
  .nobuycommon{
    text-align: center;
    img{
      width: 6rem;
      margin-top: 21rem;
    }
    .nobuyills{
      margin-top: 2rem;
      font-size: 1.5rem;
      color: #909099;
    }
  }
}
.sharemode-enter-active {
  animation: bounceshade-wordout linear .2s;
  -webkit-animation: bounceshade-wordout linear .2s;
}
.sharemode-leave-active {
  animation: bounceshade-wordout .2s linear reverse;
  -webkit-animation: bounceshade-wordout .2s linear reverse;
}
@keyframes bounceshade-wordout {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}
@-webkit-keyframes bounceshade-wordout {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

